﻿<phone:PhoneApplicationPage
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:SampleData="clr-namespace:Expression.Blend.SampleData.MenuDataSource"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit" 
    xmlns:SampleData1="clr-namespace:Expression.Blend.SampleData.AppStatusDataSource" 
    xmlns:local="clr-namespace:ActivityTracker"
    xmlns:ThemeableImage="clr-namespace:ActivityTracker.Library;assembly=ActivityTracker.Library"
    xmlns:my="clr-namespace:Microsoft.Advertising.Mobile.UI;assembly=Microsoft.Advertising.Mobile.UI" 
    xmlns:Custom="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 
    xmlns:im="clr-namespace:Microsoft.Expression.Interactivity.Media;assembly=Microsoft.Expression.Interactions" 
    xmlns:ic="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions" 
    x:Class="ActivityTracker.StartActivity" 
xmlns:LART="clr-namespace:CommonControls"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="False"
    Loaded="PhoneApplicationPage_Loaded">

    <phone:PhoneApplicationPage.Resources>
        <SampleData1:AppStatusDataSource x:Key="AppStatusDataSource" d:IsDataSource="True"/>
        <SampleData:MenuDataSource x:Key="MenuDataSource" d:IsDataSource="True"/>
        <DataTemplate x:Key="ItemTemplate">
            <Border Height="80" Width="380">
                <StackPanel Orientation="Horizontal" Height="80" Width="380" HorizontalAlignment="Left">
                    <TextBlock Text="{Binding MenuId}" Visibility="Collapsed"/>
                    <TextBlock Text="{Binding MenuName}" Style="{StaticResource MainMenuItemTextStyle}" HorizontalAlignment="Left" VerticalAlignment="Center"  FontSize="40" />
                </StackPanel>
            </Border>
        </DataTemplate>
        <!--<DataTemplate x:Key="ItemTemplate1">
            <Border Width="410" Height="100">
                <StackPanel Height="90" Width="410" HorizontalAlignment="Left">
                    <TextBlock Text="{Binding Name}" HorizontalAlignment="Left" VerticalAlignment="Center" Style="{StaticResource PhoneTextLargeStyle}" FontSize="36"/>
                </StackPanel>
            </Border>
        </DataTemplate>-->
        <Storyboard x:Name="StoryboardforStartImage">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="btnStart">
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.2"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="btnStart">
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.2"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Name="StoryboardforFinishImage">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="btnFinish">
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.2"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="btnFinish">
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.2"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Name="StoryboardforLapsImage">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="btnLap">
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.2"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="btnLap">
                <EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.2"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

    </phone:PhoneApplicationPage.Resources>
    <phone:PhoneApplicationPage.FontFamily>
        <StaticResource ResourceKey="PhoneFontFamilyNormal"/>
    </phone:PhoneApplicationPage.FontFamily>
    <phone:PhoneApplicationPage.FontSize>
        <StaticResource ResourceKey="PhoneFontSizeNormal"/>
    </phone:PhoneApplicationPage.FontSize>
    <phone:PhoneApplicationPage.Foreground>
        <StaticResource ResourceKey="PhoneForegroundBrush"/>
    </phone:PhoneApplicationPage.Foreground>
    <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource MenuDataSource}}">
        <controls:Panorama x:Name="panoramaPage"  SelectionChanged="panoramaPage_SelectionChanged">
            <controls:Panorama.Title>
                <StackPanel Margin="0,80,0,0" Orientation="Horizontal" Height="150">
                   <Image Margin="10,15,10,0" Source="Images/Logo.png" Width="101" Height="132" VerticalAlignment="Top" />
                    <TextBlock Text="Activity Tracker" Margin="20,20,0,-2" FontSize="80" FontFamily="Segoe WP" FontWeight="SemiBold" VerticalAlignment="Center" HorizontalAlignment="Right" Foreground="White"/>
                </StackPanel>
            </controls:Panorama.Title>
            <!--Panorama item start activity-->
            <controls:PanoramaItem  x:Name="startactivity" >
                <controls:PanoramaItem.Header>
                    <ContentControl>
                        <TextBlock Text="tracking" Style="{StaticResource MainPanoramaTitlestyle}"></TextBlock>
                    </ContentControl>
                </controls:PanoramaItem.Header>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <ScrollViewer VerticalScrollBarVisibility="Visible" MinHeight="460" Grid.Row="0">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <TextBlock Grid.Row="0" Text="select activity" Style="{StaticResource PhoneTextTitle2Style}" FontSize="36" Margin="10,2,0,-2" Foreground="White"/>
                            <Border Grid.Row="1" Margin="8" BorderThickness="{StaticResource PhoneBorderThickness}" BorderBrush="DarkGray" Width="395" Height="50" >
                                <TextBlock Margin="0,0,0,0" x:Name="tblkActName" Width="395" Height="50" FontSize="{StaticResource PhoneFontSizeLarge}" FontFamily="{StaticResource PhoneFontFamilySemiLight}" MouseLeftButtonDown="tblkActName_MouseLeftButtonDown" Foreground="White"/>
                            </Border>
                            <Grid Grid.Row="2" Margin="0,20,0,0">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="50*"/>
                                    <ColumnDefinition Width="50*"/>
                                </Grid.ColumnDefinitions>
                                <Image Grid.Row="0" Grid.Column="0" Source="Images/Start.png" Width="125" Height="77" MouseLeftButtonDown="imgStart_Click" x:Name="btnStart"  RenderTransformOrigin="0.5,0.5">
                                    <Image.RenderTransform>
                                        <CompositeTransform/>
                                    </Image.RenderTransform>
                                    <Custom:Interaction.Triggers>
                                        <Custom:EventTrigger EventName="MouseLeftButtonDown">
                                            <im:ControlStoryboardAction Storyboard="{StaticResource StoryboardforStartImage}"/>
                                        </Custom:EventTrigger>
                                    </Custom:Interaction.Triggers>
                                </Image>
                                <Image Grid.Row="0" Grid.Column="1" Source="Images/Finish.png" Width="125" Height="77" Visibility="Collapsed" MouseLeftButtonDown="imgFinish_Click" x:Name="btnFinish" RenderTransformOrigin="0.5,0.5">
                                    <Custom:Interaction.Triggers>
                                        <Custom:EventTrigger EventName="MouseLeftButtonDown">
                                            <im:ControlStoryboardAction Storyboard="{StaticResource StoryboardforFinishImage}"/>
                                        </Custom:EventTrigger>
                                    </Custom:Interaction.Triggers>
                                    <Image.RenderTransform>
                                        <CompositeTransform/>
                                    </Image.RenderTransform>
                                </Image>
                                <Image Grid.Row="0" Grid.Column="0" Source="Images/Lap.png" Width="125" Height="77" Visibility="Collapsed" MouseLeftButtonDown="imgLap_Click" x:Name="btnLap" RenderTransformOrigin="0.5,0.5">
                                    <Custom:Interaction.Triggers>
                                        <Custom:EventTrigger EventName="MouseLeftButtonDown">
                                            <im:ControlStoryboardAction Storyboard="{StaticResource StoryboardforLapsImage}"/>
                                        </Custom:EventTrigger>
                                    </Custom:Interaction.Triggers>
                                    <Image.RenderTransform>
                                        <CompositeTransform/>
                                    </Image.RenderTransform>
                                </Image>
                                <TextBlock Grid.Row="1" Grid.Column="0" Margin="0,10,0,0" Foreground="White" x:Name="tblkStartTime" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                                <TextBlock Grid.Row="1" Grid.Column="1" Margin="0,10,0,0" Foreground="White" x:Name="tblkEndTime" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                            </Grid>
                            <TextBlock Grid.Row="3" Margin="0,0,0,0" x:Name="tblktimer" Text="00:00:00" FontSize="80" HorizontalAlignment="Center" Height="115" Foreground="White"/>
                            <ListBox x:Name="lbxLaps" Grid.Row="4" Margin="10,10,0,0" ScrollViewer.VerticalScrollBarVisibility="Disabled">
                                <ListBox.ItemTemplate>
                                    <DataTemplate>
                                        <StackPanel Orientation="Horizontal" Height="60" Margin="40,0,0,0">
                                            <TextBlock Text="{Binding LapNo}" Style="{StaticResource PhoneTextTitle2Style}" x:Name="TextBlockLapName" Width="160" Foreground="White"/>
                                            <TextBlock Text="{Binding LapTime}" Style="{StaticResource PhoneTextTitle2Style}" x:Name="TextBlockLapTime" Foreground="White"/>
                                        </StackPanel>
                                    </DataTemplate>
                                </ListBox.ItemTemplate>
                            </ListBox>
                            <TextBlock x:Name="tblkStatus" Grid.Row="5" Margin="20,10,0,0" Visibility="Collapsed" FontSize="16" Foreground="White"/>
                        </Grid>
                    </ScrollViewer>
                    <Grid Grid.Row="1" x:Name="theMessage" VerticalAlignment="Top" HorizontalAlignment="Left" Visibility="Collapsed" Margin="10,-35,10,10" >
                        <Border CornerRadius="10" BorderThickness="{StaticResource PhoneBorderThickness}" BorderBrush="#ec008c" Background="#464646">

                            <StackPanel Orientation="Horizontal" Opacity="0.6" Margin="5,0,5,10" MouseLeftButtonUp="hlink_Click">
                                <TextBlock x:Name="tblkTips" Visibility="Collapsed"/>
                                <TextBlock x:Name="hlink" FontSize="20" Width="420" Height="80"  Margin="2,2,2,2" Foreground="#8ad8fe" VerticalAlignment="Top" TextWrapping="Wrap"/>
                            </StackPanel>

                        </Border>
                    </Grid>
                </Grid>
            </controls:PanoramaItem>

            <!--Panorama item history-->
            <controls:PanoramaItem x:Name="history">
                <controls:PanoramaItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="history" Style="{StaticResource MainPanoramaTitlestyle}"></TextBlock>
                        <Image  Margin="150,20,0,0" Source="Images/plus.png" MouseLeftButtonDown="imgAddHistory_MouseLeftButtonDown" Width="48" Height="48" />
                    </StackPanel>
                </controls:PanoramaItem.Header>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <ListBox x:Name="lbxHistory" Grid.Row="0" SelectionChanged="lbxHistory_SelectionChanged" ScrollViewer.VerticalScrollBarVisibility="Hidden" local:TiltEffect.IsTiltEnabled="True">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <Border Height="120">
                                    <StackPanel Margin="0,0,0,17" Orientation="Horizontal" HorizontalAlignment="Left" Height="100">
                                        <toolkit:ContextMenuService.ContextMenu>
                                            <toolkit:ContextMenu>
                                                <toolkit:MenuItem Header="Delete" Click="contextMenu_Delete_Click"/>
                                            </toolkit:ContextMenu>
                                        </toolkit:ContextMenuService.ContextMenu>
                                        <TextBlock Margin="5,0,0,0" Width="280" x:Name="txtblkrecent" Text="{Binding ActName}" FontSize="36" HorizontalAlignment="Left" VerticalAlignment="Center" Style="{StaticResource MainMenuItemTextStyle}" TextWrapping="Wrap"/>
                                        <TextBlock Margin="3,0,0,0" Width="63" x:Name="txtblkdur" Text="{Binding ActDuration}" FontSize="24" VerticalAlignment="Center" HorizontalAlignment="Left" Style="{StaticResource MainMenuItemTextStyle}"/>
                                        <TextBlock Margin="3,0,0,0" Width="58" x:Name="txtblkdate" Text="{Binding ActStartDate}" FontSize="24" VerticalAlignment="Center" HorizontalAlignment="Left" Style="{StaticResource MainMenuItemTextStyle}"/>
                                    </StackPanel>
                                </Border>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>
                </Grid>
            </controls:PanoramaItem>

            <!--Panorama item about-->
            <controls:PanoramaItem >
                <controls:PanoramaItem.Header>
                    <ContentControl>
                        <TextBlock Text="about" Style="{StaticResource MainPanoramaTitlestyle}"></TextBlock>
                    </ContentControl>
                </controls:PanoramaItem.Header>
                <Grid x:Name="AboutGrid">
                    <LART:AboutUs />
                </Grid>
            </controls:PanoramaItem>

            <!--Panorama item menu-->
            <controls:PanoramaItem >
                <controls:PanoramaItem.Header>
                    <ContentControl>
                        <TextBlock Text="menu" Style="{StaticResource MainPanoramaTitlestyle}"></TextBlock>
                    </ContentControl>
                </controls:PanoramaItem.Header>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>

                    <ListBox x:Name="lbxMenu" ItemTemplate="{StaticResource ItemTemplate}" ItemsSource="{Binding Collection}" Margin="0,0,8,-190" VerticalAlignment="Bottom" ScrollViewer.VerticalScrollBarVisibility="Disabled" SelectionChanged="lbxMenu_SelectionChanged" local:TiltEffect.IsTiltEnabled="True" />

                </Grid>
            </controls:PanoramaItem>
        </controls:Panorama>
    </Grid>
</phone:PhoneApplicationPage>